import React, { Component } from "react";
import logo from "./logo.svg";
import "./App.css";
import { Button } from "@material-ui/core";
import { useNavigate } from "react-router-dom";

function App() {
  var navigate  = useNavigate();

  function gotoItemInformationPage(): void {
    navigate("/ItemInformation");
  }


  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <Button color="primary" variant="contained" onClick={()=>navigate("/BasicUsage")}>
        BasicUsage
        </Button>
        <br/>
        <Button color="primary" variant="contained" onClick={()=>navigate("/BasicUsageCC")}>
        BasicUsage
        </Button>
        <br/>
        <Button color="primary" variant="contained" onClick={()=>navigate("/RouterTest")}>
        RouterTest
        </Button>
        <br/>
        <Button color="primary" variant="contained" onClick={gotoItemInformationPage}>
          Item Information
        </Button>
        
      </header>
    </div>
  );
}



export default App;
